<template>
    <div class="vendor_box">
        <div style="padding: 0 20px;">
            <div class="vendor">
            <div>
                <img width="60px" src="@/assets/img/gys.png" alt="">
            </div>
            <div style="flex: 1; margin-left: 10px;">
                <div class="vendor_cen">
                    <div class="vendor_h">上海中飞办公设备有限公司</div>
                    <div><span class="origin">最近中标 2024-01-19</span><span class="origin">中标8118次</span><span class="origin">中标总金额9793.18万</span></div>
                </div>
                <div class="omission"><span style="color: #A9B1BE;">采购产品：</span>打印复印纸、喷墨多功能一体机、空调机组、彩色激光打印机、配件、一体机、彩色复印纸、制冷空调设备、数码印刷机、办公设备及耗材</div>
            </div>
        </div>
    </div>
    <Pagination ref="pagination"/>
</div>
</template>

<script setup>
import Pagination from '@/components/pagination/index.vue';
// const pagination = ref(null);
// pagination.value.currentPage
// pagination.value.pageSize

</script>

<style lang="scss" scoped>
.origin {
    padding: 5px 6px;
    border-radius: 4px;
    background-color: #FE8D03;
    color: #fff;
    margin-left: 10px;
    font-size: 14px;
}
.vendor_box{

    background-color: #fff;
    // 
    .vendor{
        display: flex;
        padding: 20px 0;
        border-bottom: 1px solid #EEEEEE ;
    }

    .vendor_cen{
        display: flex;
        justify-content: space-between;
        margin-bottom: 20px;
        .vendor_h{
            font-size: 16px;
            color: #333333;
        }
    }
    .omission {
        width: 1090px;
        overflow: hidden;
        white-space: nowrap; 
        text-overflow: ellipsis;
        text-align: left;
    }
}

</style>